<template>
<div>
  <el-menu  class="el-menu-demo" mode="horizontal" active-text-color="#20a0ff"  :default-active="$route.path" router >
    <el-menu-item v-show="isShowSecondMenu(item.name)" v-for="(item, key) in paths" :key="key"  :index="item.path">{{$t('message.systems.' + item.name)}}</el-menu-item> 
</el-menu>
<router-view class="router-view-2"></router-view>
</div>
</template>

<script>
import hello from "../../../../components/hello.vue";
import ebus from "../../../../libs/ebus";
import { mapState } from "vuex";
export default {
  components: {
    hello
  },
  created() {
    ebus.emit("getProductInfo", this);
    ebus.emit("getSystemTime", this);
    ebus.emit("autoFitTime", this);
    ebus.emit("getAgingStates", this);
    ebus.emit("getTopics", this);
  },
  computed:{
    ...mapState(["system"]),
  },
  data() {
    return {
      paths: [
        { path: "/system/syssetting", name: 'sysSetting' },
        { path: "/system/sysstorage", name: 'sysStorage' },
        { path: "/system/runninginfo", name: 'sysRunning' },
        { path: "/system/netsetting", name: 'sysNet' },
        { path: "/system/webdav", name: 'webdav' },
        { path: "/system/swagger", name: 'swagger' }
      ]
    };
  },
  methods:{    
    isShowSecondMenu(name){
      return (name != 'swagger' && name != 'webdav' || ((name == 'swagger' || name == 'webdav') && this.system.productInfo && this.system.productInfo.isDebugMode));
    }
  }
};
</script>
<style>
@import "../../../../style/common.css";
</style>


